import { HashRouter, Routes, Route } from "react-router-dom";
import { lazy, Suspense } from 'react'
import { Navigate } from "react-router-dom";

const Index = lazy(() => import('../pages/index/index'))
const Manage = lazy(()=>import('../pages/manage/manage'))
const Shoplist = lazy(()=>import('../pages/management/shoplist/shoplist'))
const Userlist = lazy(()=>import('../pages/management/userlist/userlist'))
const Visitor = lazy(()=>import('../pages/visitor/visitor'))

export default function App() {
    return (
        <HashRouter>
            <Suspense  fallback={<h2>Loading...</h2>}>
                <Routes>
                    <Route path="/" element={<Index></Index>}>
                        <Route path="" element={<Navigate to="index" />}></Route>
                        <Route path="index" element={<Manage/>}></Route>
                        <Route path="shoplist" element={<Shoplist/>}></Route>
                        <Route path="userlist" element={<Userlist />}></Route>
                        <Route path="visitor" element={<Visitor />}></Route>
                    </Route>
                </Routes>
            </Suspense>
        </HashRouter>
    )
}